<template>
    <div>
        <div class="front-header">
            <div class="front-header-left">
                <div class="title">博客论坛平台</div>
            </div>
            <div class="front-header-center">
                <div class="front-header-nav">
                    <el-menu :default-active="currentPath" mode="horizontal" router>
                        <el-menu-item index="">首页</el-menu-item>
                        <el-menu-item index="">活动中心</el-menu-item>
                        <el-menu-item index="">个人中心</el-menu-item>
                    </el-menu>
                </div>
            </div>
            <div>
                <!-- 缺少一个v-model -->
                <el-input style="width: 260px; margin-right: 10px" placeholder="请输入关键字搜索" clearable></el-input>
                <el-button type="success" @click="goSearch">搜 索</el-button>
            </div>
            <div class="front-header-right">
                <div><!-- 缺少登录后转变为头像和用户id的v-if-->
                    <el-button @click="$router.push('/login')">登录</el-button>
                    <el-button @click="$router.push('/register')">注册</el-button>
                </div>
            </div>
        </div>
        <div class="main-body">
            <router-view :key="$route.fullPath" />
        </div>
    </div>
</template>
<script>
export default {
    name: 'Front',
    data(){
        return{

        }
    },
    computed: {
        currentPath() {
            return this.$route.fullPath;
        }
    },
    methods:{
        goSearch(){

        }
    }
}
</script>

<style scoped>
  @import "../assets/css/front.css";
</style>